<%--
  Created by IntelliJ IDEA.
  User: liujiajia
  Date: 2016/12/26
  Time: 上午10:07
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>统计首页</title>
    <meta charset="UTF-8">
    <title>Tabbar</title>
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport"/>
    <meta content="yes" name="apple-mobile-web-app-capable"/>
    <meta content="black" name="apple-mobile-web-app-status-bar-style"/>
    <meta content="telephone=no" name="format-detection"/>
</head>
<body>

<header class="m-navbar">
    <span><i class="home-crt"></i></span>

    <div class="navbar-center"><span class="navbar-title">久零运营支撑</span></div>
</header>

<section class="g-scrollview">

    <div class="m-cell demo-small-pitch" style="background-color: #D75642;height: 60px">
        <div class="cell-item">
            <div class="cell-left"><h2>商户总数</h2></div>
            <div class="cell-right"><h3><span id="BrandAllCount_id">0</span></h3></div>
        </div>
    </div>
    <div class="m-cell demo-small-pitch" style="background-color: #F5C50F;height: 60px">
        <div class="cell-item">
            <div class="cell-left"><h2>会员总数</h2></div>
            <div class="cell-right"><h3><span id="UserAllCount_id">0</span></h3></div>
        </div>
    </div>
    <div class="m-cell demo-small-pitch" style="background-color: #64C2E5;height: 60px">
        <div class="cell-item">
            <div class="cell-left"><h2>门店总数</h2></div>
            <div class="cell-right"><h3><span id="ShopAllCount_id">0</span></h3></div>
        </div>
    </div>
    <div class="m-cell demo-small-pitch" style="background-color: #60E390;height: 60px">
        <div class="cell-item">
            <div class="cell-left"><h2>粉丝总数</h2></div>
            <div class="cell-right"><h3><span id="GZAllCount_id">0</span></h3></div>
        </div>
    </div>

    <div class="m-celltitle">久零券</div>

    <div id="J_Tab" class="m-tab demo-pitch">
        <ul class="tab-nav">
            <li class="tab-nav-item tab-active"><a href="javascript:;">已发券</a></li>
            <li class="tab-nav-item"><a href="javascript:;">已核券</a></li>
            <li class="tab-nav-item"><a href="javascript:;">未核券</a></li>
        </ul>
        <div class="tab-panel">
            <%--已发券--%>
            <div class="tab-panel-item tab-active">
                <div class="m-button" style="float: right;">
                    <a href="javascript:;" class="btn btn-hollow">当日</a>
                    <a href="javascript:;" class="btn btn-hollow">7天</a>
                    <a href="javascript:;" class="btn btn-hollow">30天</a>
                </div>
                <!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
                <div id="e_main" style="width: 370px;height:400px;"></div>
            </div>
            <%--已核券--%>
            <div class="tab-panel-item">
                真理惟一可靠的标准就是永远自相符合。
            </div>
            <%--未核券--%>
            <div class="tab-panel-item">
                真正的科学家应当是个幻想家；谁不是幻想家，谁就只能把自己称为实践家。
            </div>
        </div>
    </div>
</section>


<jsp:include page="mamin/footer.jsp?page=2"></jsp:include>
</body>
<script src="http://123.206.127.237:85/ydui/ecaharts/echarts.common.min.js"></script>
<script src="http://123.206.127.237:85/ydui/ecaharts/dark.js"></script>
<script>
    /**
     * Javascript API调用Tab
     */


    $(function(){
        getRootCount();
        getRootVoucherList();
    });

    var ajaxpath = "${pageContext.request.contextPath}";
    function getRootCount() {
        $.ajax({
            url: ajaxpath + "/report/getToRootListCount.do?guid=" + new Date(),
            type: 'post',
            async: false,
            success: function (data) {
                var datajson=JSON.parse(data)
                var BrandAllCount = datajson.BrandAllCount;//商户总数
                var UserAllCount = datajson.UserAllCount;//会员总数
                var ShopAllCount = datajson.ShopAllCount;//门店总数
                var GZAllCount = datajson.GZAllCount;//粉丝总数

                $("#BrandAllCount_id").html(BrandAllCount);
                $("#UserAllCount_id").html(UserAllCount);
                $("#ShopAllCount_id").html(ShopAllCount);
                $("#GZAllCount_id").html(GZAllCount);
            }
        });
    }


    function getRootVoucherList() {
        var addCount=0;
        $.ajax({
            url: ajaxpath + "/report/getToRootVoucherList.do?guid=" + new Date(),
            type: 'post',
            async: false,
            data : {
                addCount : addCount
            },
            success: function (data) {
                var datajson=JSON.parse(data)
                var dataListJson='';
                VoucherList(30,dataListJson);
            }
        });
    }

    function VoucherList(dataCount,dataList){

        var $tab = $('#J_Tab');
        $tab.tab({
            nav: '.tab-nav-item',
            panel: '.tab-panel-item',
            activeClass: 'tab-active'
        });


        $tab.find('.tab-nav-item').on('opened.ydui.tab', function (e) {
            console.log('索引：%s - [%s]已经打开了', e.index, $(this).text());
        });


        var xData = function () {
            var data = [];
            for (var i = 1; i < dataCount; i++) {
                data.push(i + "天");
            }
            return data;
        }();
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('e_main'));
        myChart.showLoading();
        // 指定图表的配置项和数据
        var option = {
                    title: {
                        text: ' '
                    },
                    tooltip: {},
    xAxis: {
        data: xData
    },
    yAxis: {},
    series: [{
        name: '销量',
        type: 'bar',
        data: [5, 20, 36, 10]
    }]
    };

    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);
    myChart.hideLoading();
    }

</script>

</html>
